import React from "react";
import { useState } from "react";
import { getHeroAction } from "../../redux/slices/heroSlice";
import { useDispatch } from "react-redux";
export default function Search() {
  //声明状态
  let [keyword, setKeyword] = useState("");
  //获取 dispatch 函数
  let dispatch = useDispatch();

  //声明函数
  let changeHandle = (e) => {
    setKeyword(e.target.value);
  };

  //声明函数点击事件的回调
  let send = () => {
    //发布
    dispatch(getHeroAction(keyword));
  };

  return (
    <div style={{ textAlign: "right" }}>
      <input type="text" value={keyword} onChange={changeHandle} />{" "}
      <button onClick={send}>搜索</button>
    </div>
  );
}
